<!--
设备拓扑页面
-->
<template>
  <div id="topodiv" style="width: 100%">
    <topo
      v-if="width != 0"
      :topo-data="topoData"
      :width="width"
      :height="500"
      :elem-id="'test' + this.$store.state.Group.groupId"
      :option="topOptions"
      ref="topo"
    />
  </div>
</template>
<script>
import { topo } from '@components';
import topoDataMethods from '@mixin/topoData-mixin';
export default {
  mixins: [topoDataMethods],
  name: 'pdftopo',
  props: {},
  components: { topo },
  data() {
    return {
      groupId: '',
      topOptions: {
        filterClass: ['AP_GROUP'],
      },
      width: 0,
    };
  },
  mounted() {
    let width = document.getElementById('pdfContent').offsetWidth - 200;
    this.width = width;
  },
  watch: {
    width(n) {
      if (n > 0) {
        this.initTopo(false);
      }
    },
  },
  methods: {
    initView() {},
    getPngUri() {
      let self = this;
      this.$refs.topo.getPngUri({}, function (uri, width, height) {
        let tupo = uri; // encodeURIComponent(uri);
        let params = { tupo, topoWidth: width, topoHight: height };
        self.$emit('getTupoUri', params);
      });
    },
  },
  computed: {},
};
</script>
<style lang="less" scoped></style>
